<!-- Navigation -->
<nav class="navbar fixed-top navbar-toggleable-md navbar-light sb-navbar">
    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarExample" aria-controls="navbarExample" aria-expanded="false" aria-label="Toggle navigation">
        Menu <i class="fa fa-bars"></i>
    </button>
    <div class="container">
        <a class="navbar-brand" href="/">Start Bootstrap</a>
        <div class="collapse navbar-collapse" id="navbarExample">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="dropdownThemes" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Themes</a>
                    <div class="dropdown-menu" aria-labelledby="dropdownThemes">
                        <a class="dropdown-item" href="/template-categories/all"><i class="icon-layers fa-fw"></i> All Templates &amp; Themes</a>
                        <a class="dropdown-item" href="/template-categories/popular"><i class="icon-star fa-fw"></i> Most Popular</a>
                        <a class="dropdown-item" href="/buy-bootstrap-templates"><i class="icon-handbag fa-fw"></i> Buy Bootstrap Templates</a>
                        <div class="dropdown-divider"></div>
                        <h6 class="dropdown-header">Template &amp; Theme Categories:</h6>
                        <a class="dropdown-item" href="/template-categories/admin-dashboard">Admin and Dashboard</a>
                        <a class="dropdown-item" href="/template-categories/full-websites">Full Websites</a>
                        <a class="dropdown-item" href="/template-categories/landing-pages">Landing Pages</a>
                        <a class="dropdown-item" href="/template-categories/one-page">One Page Websites</a>
                        <a class="dropdown-item" href="/template-categories/portfolios">Portfolios</a>
                        <a class="dropdown-item" href="/template-categories/blogs">Blogs</a>
                        <a class="dropdown-item" href="/template-categories/ecommerce">Ecommerce</a>
                        <a class="dropdown-item" href="/template-categories/unstyled">Unstyled Starter Templates</a>
                        <a class="dropdown-item" href="/template-categories/navigation-menus">Navigation and Navbars</a>
                    </div>
                </li>
                <!-- <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="dropdownGuides" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Guides</a>
                    <div class="dropdown-menu" aria-labelledby="dropdownGuides">
                        <a class="dropdown-item" href="#"><i class="icon-docs fa-fw"></i> All Guides &amp; Tutorials</a>
                        <div class="divider"></div>
                        <h6 class="dropdown-header">Guides &amp; Tutorials Categories:</h6>
                        <a class="dropdown-item" href="#">Coming Soon</a>
                    </div>
                </li> -->
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="dropdownResources" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Resources</a>
                    <div class="dropdown-menu" aria-labelledby="dropdownResources">
                        <a class="dropdown-item" href="/bootstrap-resources"><i class="icon-list"></i> Bootstrap Resources List</a>
                        <a class="dropdown-item" href="/help"><i class="icon-support"></i> Help &amp; FAQ</a>
                    </div>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="/articles" title="Start Bootstrap News, Guides, and Tutorials">Articles</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="/contact" title="Contact Start Bootstrap">Contact</a>
                </li>
            </ul>
            <ul class="navbar-nav">
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="dropdownPremium" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="icon-star"></i> Premium</a>
                    <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownPremium">
                        <a class="dropdown-item" href="/bootstrap-design-services"><i class="icon-pencil fa-fw"></i> Custom Bootstrap Design Services</a>
                        <a class="dropdown-item" href="https://wrapbootstrap.com/?ref=StartBootstrap"  onclick="ga('send','event','Referral','Referral WrapBootstrap Navbar')"><i class="icon-handbag fa-fw"></i> WrapBootstrap<span class="hidden-xs-down"> - Premium Bootstrap Themes</span></a>
                    </div>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#" data-toggle="modal" data-target="#searchModal"><i class="icon-magnifier"></i> <span class="hidden-lg-up">Search Themes</span></a>

                </li>
            </ul>
        </div>
    </div>
</nav>
